<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <title>系统字典</title>
    <script src="../../../static/kaige/js/szload.js"></script>
    <style>
        .layui-card-body .layui-table {
            margin: 0;
        }

        .kaige-body {
            background-color: #f2f2f2;
        }

        form.kaige-body {
            background-color: #fff;
            padding: 0;
        }

        .layui-elem-quote {
            margin-bottom: 5px;
            padding: 12px;
            line-height: 1;
            border-left: 5px solid #04469c;
            border-radius: 0;
            background-color: #2680cf;
            color: #fff;
        }

        .layui-elem-quote2 {
            margin-bottom: 5px;
            padding: 12px;
            line-height: 1;
            border-left: 5px solid #095198;
            border-radius: 0;
            background-color: #cee8ff;
            color: #333;
        }

        .layui-card-header {
            height: 40px;
            line-height: 40px;
            padding: 0 5px;
            border-radius: 0;
            font-size: 14px;
        }
    </style>
</head>

<body>
    <script type="text/html" id="TPL-treeTable-header">
        <div class="layui-inline">
            <div class="kaige-select-div" id="company_id2_select_box"></div>
            <input type="hidden" id="company_id2_name"/>
            <input type="hidden" id="company_id2"/>
        </div>
        <div class="layui-btn-group">
            <button type="button" class="layui-btn layui-bg-blue layui-btn-sm" lay-event="add"><i class="layui-icon layui-icon-add-circle"></i></button>
            <button type="button" class="layui-btn layui-bg-blue layui-btn-sm" lay-event="reload"><i class="layui-icon layui-icon-refresh"></i></button>
            <button type="button" class="layui-btn layui-bg-blue layui-btn-sm" lay-event="open-all"><i class="layui-icon layui-icon-down"></i></button>
            <button type="button" class="layui-btn layui-bg-blue layui-btn-sm" lay-event="close-all"><i class="layui-icon layui-icon-right"></i></button>
        </div>
    </script>
    <script type="text/html" id="TPL-treeTable-tdbar">
        <div class="layui-btn-group">
             <a class="layui-btn layui-bg-blue layui-btn-sm" lay-event="edit"><i class="layui-icon layui-icon-edit"></i></a>
            <a class="layui-btn layui-bg-red layui-btn-sm"  lay-event="del"><i class="layui-icon layui-icon-delete"></i></a>
        </div>
    </script>
    <div class="kaige-body layui-form">
        <div class="layui-row layui-col-space5">
            <div class="layui-col-xs5">
                <div class="layui-card">
                    <blockquote class="layui-elem-quote layui-text">
                        系统字典(注意：字典只做二级)
                    </blockquote>
                    <div class="layui-card-body" style="padding: 3px;">
                        <table class="layui-table" id="dictTable" lay-filter="dictTable"></table>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs7">
                <div class="layui-card">
                    <blockquote class="layui-elem-quote2 layui-text" id="dictItemTitle">
                        详细信息
                    </blockquote>
                    <div class="layui-card-header">
                        <div class="layui-btn-group">
                            <button type="button" class="layui-btn layui-btn-sm" title="提交保存" id="btn_form_save">
                                <i class="fa fa-save"></i> 保存
                            </button>
                        </div>
                    </div>
                    <div class="layui-card-body" style="padding: 3px;background-color: #fff;">
                        <div id="dictItemForm"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        load_init_js(function () {
            layui.config({
                base: szoapcpath + '/static/kaige/layuiextend/'
            }).use(['kaige', 'xmSelect'], function () {
                var form = layui.form, layer = layui.layer,
                    table = layui.table, element = layui.element,
                    $ = layui.$, kaige = layui.kaige, treeTable = layui.treeTable,
                    laytpl = layui.laytpl, xmSelect3 = layui.xmSelect;
                var loadcom = 0;

                // 渲染表格
                var dictre = treeTable.render({
                    elem: "#dictTable",
                    id: "IDdictTable",
                    url: "/sys.dict/index",
                    toolbar: '#TPL-treeTable-header',
                    height: 'full-70',
                    cols: [[
                        { field: 'name', title: '名称', width: 220 },
                        { field: 'code', title: '编码', width: 180 },
                        { field: 'id', title: 'ID', width: 70, hide: true },
                        { fixed: "right", title: "操作", width: 120, align: "center", toolbar: "#TPL-treeTable-tdbar" },
                    ]],
                    page: false,
                    tree: {
                        view: { expandAllDefault: true, showIcon: false }
                    },
                    done: function () {
                        if (loadcom < 1) {
                            //所属单位
                            kaige.xmSelectTree({
                                id: 'company_id2',
                                url: '/select/companytree',
                                udata: { automatch: 1 },
                                radio: true,
                                clickClose: true,
                                style: {
                                    minHeight: '30px',
                                    lineHeight: '30px',
                                    borderRadius: '30px',
                                    height: '30px',
                                },
                                tips: '请选择单位',
                                callback: function (des) {
                                    //执行重载数据
                                    treeTable.reloadData('IDdictTable', {
                                        where: {
                                            company_id: des.id
                                        }
                                    });
                                }
                            });
                            loadcom++;
                        }
                    }
                });

                // 表头工具栏工具事件
                treeTable.on("toolbar(dictTable)", function (obj) {
                    // 获取选中行
                    switch (obj.event) {
                        case "add":
                            btn_add();
                            break;
                        case "reload":
                            treeTable.reloadData('IDdictTable');
                            break;
                        case "open-all":
                            treeTable.expandAll('IDdictTable', true); // 展开全部节点
                            break;
                        case "close-all":
                            treeTable.expandAll('IDdictTable', false); // 关闭全部节点
                            break;
                    }
                });

                // 单元格工具事件--此处是 filter  不是 id
                treeTable.on('tool(dictTable)', function (obj) {
                    switch (obj.event) {
                        case "look":
                            btn_look(obj.data);
                            break;
                        case "edit":
                            btn_edit(obj);
                            break;
                        case "del":
                            btn_del(obj.data);
                            break;
                    }
                });

                $('#btn_form_save').on('click', function (e) {
                    $('#kaige_form_btn_save').click();
                    return false;
                });

                //监听行单击事件（双击事件为：rowDouble）
                treeTable.on('rowDouble(dictTable)', function (obj) {
                    btn_edit(obj);
                });

                //删除
                function btn_del(d) {
                    layer.confirm('如果有子项会一并删除，您确定删除吗？', {
                        title: '<i class="layui-icon layui-icon-delete"></i> 删除确认',
                        btn: ['确认', '取消']
                    }, function () {
                        $.post("/sys.dict/del", { id: d.id }, function (res) {
                            res.status && treeTable.reloadData('IDdictTable');
                            layer.msg(res.msg);
                        });
                    });
                };

                function btn_edit(obj) {
                    var data = obj.data;
                    //如果锁定，不能提交
                    if (data.is_lock == 1) {
                        layer.msg('系统已锁定的不能编辑');
                        return false;
                    }
                    //标注选中样式
                    obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
                    if (data.is_lock == 1) {
                        $('#btn_form_save').hide();
                        $('#dictItemTitle').html(data.name + ' [已锁定，编辑无效]');
                    } else {
                        $('#btn_form_save').show();
                        $('#dictItemTitle').html(data.name + ' [编辑]');
                    }
                    kaige.form({
                        opentype: 'dom'  // 写dom 非弹窗 必填此项
                        , url: '/sys.dict/edit' //数据源
                        , data: { id: data.id }
                        , box: 'dictItemForm'
                        , id: 'kaige'
                        , encode: 1
                        , callbefore: function () {
                            addeditform();
                        }
                    });
                }

                function btn_add() {
                    $('#dictItemTitle').html('字典 [添加]');
                    $('#btn_form_save').show();
                    // 使用 kaige.form 表单里标识及tpl的ID前缀必须是 kaige id:'kaige'
                    kaige.form({
                        opentype: 'dom'  // 写dom 非弹窗 必填此项
                        , url: '/sys.dict/add' //数据源
                        , box: 'dictItemForm'
                        , id: 'kaige'
                        , encode: 1
                        , callbefore: function () {
                            addeditform();
                        }
                        , callback: function (res) {
                            res.status && treeTable.reloadData('IDdictTable');
                        }
                    });
                }

                function addeditform() {
                    //上级字典
                    kaige.xmSelectTree({
                        id: 'dict_pid',
                        url: '/select/dicttree',
                        udata: { automatch: 1 },
                        radio: true,
                        clickClose: true
                    });
                    //单位选择
                    kaige.xmSelectTree({
                        id: 'company_id',
                        url: '/select/companytree',
                        udata: { automatch: 1 },
                        radio: true,
                        clickClose: true
                    });
                }
            });
        });
    </script>
    <script type="text/html" id="dtrbar">
        <div class="layui-btn-group">
            {{# if(d.is_lock != 1){ }}
            <button type="button" class="layui-btn layui-btn-xs" lay-event="edit" title="编辑"><i class="layui-icon layui-icon-edit"></i></button>        
            <button type="button" class="layui-btn layui-btn-xs" lay-event="del" title="删除"><i class="layui-icon layui-icon-delete"></i></button>
            {{# } }}
        </div>
    </script>

    <script id="kaige_form_html" type="text/html">
        <form class="kaige-body layui-form layui-form-pane" lay-filter="kaige_form_lay_filter">
        {{# if(d.id){ }}
        <input type="hidden" name="id" value="{{ d.id }}" />
        {{# } }}
        <div class="layui-form-item">
          <label class="layui-form-label">上级</label>
          <div class="layui-input-inline">
            <select name="pid" lay-filter="dict_pid" lay-search="">
                <option value=""></option>
                <option value="0" {{ d.pid==0 ? "selected" :"" }}>顶级</option>
                {{# layui.each(d.dictPid,function(i8,e8){ }}
                <option value="{{e8.id}}" {{ e8.id==d.pid?'selected':'' }}>{{e8.name}}</option>
                {{# }); }}
            </select>
          </div>
          <label class="layui-form-label">所属单位</label>
          <div class="layui-input-inline">
            <div id="company_id_select_box"></div>
            <input type="hidden" id="company_id_name" />
            <input type="hidden" id="company_id" value="{{ d.company_id || '' }}" name="company_id" />
          </div>
        </div>
        <div class="layui-form-item">
          <label class="layui-form-label">名称</label>
          <div class="layui-input-inline">
            <input type="text" name="name" required lay-verify="required" value="{{ d.name || '' }}" placeholder="请输入名称" autocomplete="off" class="layui-input" />
          </div>
          <label class="layui-form-label">编码</label>
          <div class="layui-input-inline">
            <input type="text" name="code" required lay-verify="required" value="{{ d.code || '' }}" placeholder="请输入编码" autocomplete="off" class="layui-input" />
          </div>
        </div>
        <div class="layui-form-item">
          <label class="layui-form-label">值</label>
          <div class="layui-input-inline">
            <input type="text" name="value" required lay-verify="required" value="{{ d.value || '' }}" autocomplete="off" class="layui-input" />
          </div>
          <label class="layui-form-label">排序</label>
          <div class="layui-input-inline">
            <input type="text" name="sort" class="layui-input" value="{{ typeof(d.sort)==='number' ? d.sort: '' }}" />
          </div>
        </div>
      
        <div class="layui-form-item">
          <label class="layui-form-label">锁定</label>
          <div class="layui-input-inline border3">
            <input type="checkbox" name="is_lock" lay-skin="switch" lay-text="已锁定|未锁定" {{#  if(d.is_lock ==1 ){ }} checked {{#  } }} />
          </div>
          <label class="layui-form-label">类别</label>
          <div class="layui-input-inline border3">
            <input type="checkbox" name="type" lay-skin="switch" lay-text="系统|应用" {{#  if(d.type ==1 ){ }} checked {{#  } }} />
          </div>
        </div>
      
        <div class="layui-form-item">
          <label class="layui-form-label">说明</label>
          <div class="layui-input-block">
            <textarea name="explain" class="layui-textarea" style="height: 150px;">{{ d.explain || '' }}</textarea>
          </div>
        </div>
      
        <div class="layui-form-item">
          <label class="layui-form-label">操作人</label>
          <div class="layui-input-inline">
            {{#  if(d.handle_name !== undefined  && d.handle_name !== ''){ }}
            <input value="{{ d.handle_name }}" class="layui-input layui-disabled" type="text" readonly>
            {{# }else{ }}
            <input value="{{ d.userInfo.real_name || '' }}" class="layui-input layui-disabled" type="text" readonly>
            {{#  } }}
          </div>
          <label class="layui-form-label">操作时间</label>
          <div class="layui-input-inline">
            <input value="{{ d.handle_time || '' }}" class="layui-input layui-disabled" type="text" readonly>
          </div>
        </div>
        <div class="layui-form-item layui-hide">
            <button class="layui-hide" lay-submit="" id="kaige_form_btn_save" lay-filter="kaige_form_btn_save">保存数据</button>
        </div>
    </form>
  </script>
</body>

</html>